<template>
<div>
  <el-input type = "text" style = "width:200px;" ref = "input" v-model = "value" ></el-input>
  <el-button type = "primary" ref = "btn" @click = myClick>点击按钮</el-button>
</div>
</template>

<script>
export default {
  name: "refs",
  data(){
    return{
      value:'只缘身在此山中'
    }
  },
  mounted(){
    console.log(this.$refs.input)
    console.log(this.$refs.btn)

    // 页面刚刷新时自动获取焦点
    this.$refs.input.focus()
  },
  created(){
      this.$nextTick(function () {
        this.value = '不识庐山真面目'
      })
  },
  methods:{
    myClick(){
      console.log("输入的内容:",this.$refs.input.value)
    }
  }
}
</script>

<style scoped>
.el-button{
  margin:20px;
}
</style>
